<template>
  <div class="SWDZMX_Map">
    <LeftFoldPanel :isHeight="true">
      <CardItem title="粮食生产" height="30%">
        <LeftList :data="statisticData"></LeftList>
      </CardItem>
      <CardItem title="中药材生产">
        <CenterList :data="statisticData"></CenterList>
      </CardItem>
      <CardItem title="主要经济作物生产" height="52%" style="margin-top: -20px">
        <ButtomList :data="statisticData"></ButtomList>
      </CardItem>
    </LeftFoldPanel>
    <RightFoldPanel :isHeight="true">
      <CardItem title="畜牧业及渔业生产" height="52%">
        <RightTop :data="statisticData"></RightTop>
      </CardItem>
      <CardItem title="水果生产" height="20%">
        <RightCenter :data="statisticData"></RightCenter>
      </CardItem>
      <CardItem title="茶叶生产" height="28%">
        <RightBottom :data="statisticData"></RightBottom>
      </CardItem>
    </RightFoldPanel>
  </div>
</template>

<script setup lang="ts">
import LeftFoldPanel from '@/components/LeftFoldPanel.vue';
import CardItem from '@/components/CardItem.vue';
import RightFoldPanel from '@/components/RightFoldPanel.vue';
import LeftList from '../CYFN/ResourceTab/LeftList.vue';
import CenterList from '../CYFN/ResourceTab/CenterList.vue';
import ButtomList from '../CYFN/ResourceTab/ButtomList.vue';
import RightTop from '../CYFN/ResourceTab/NyfzTop.vue';
import RightCenter from '../CYFN/ResourceTab/RightCenter.vue';
import RightBottom from '../CYFN/ResourceTab/RightBottom.vue';
import RightList from '../ResourceTab/RightList.vue';
import BtmList from '../ResourceTab/BtmList.vue';

const props = defineProps({
  statisticData: {
    type: Object,
    default: () => {
      return {};
    }
  }
});
</script>

<style lang="scss" scoped></style>
